﻿<!DOCTYPE html>
<html>
<head>
    <title>Demo of ACE Editor</title>
    <!--导入js库-->
    <script src="ace.js"></script>
    <script src="ext-language_tools.js"></script>
</head>

<body>
    <!--代码输入框（注意请务必设置高度，否则无法显示）-->
<pre id="code" class="ace_editor" style="min-height:800px">
<textarea class="ace_text-input">
#include <cstdio>
int main(){
int n,m;
scanf("%d %d",&n,&m);
printf("%d",n+m);
return 0;
}
</textarea>
</pre>

    <script>
        //初始化对象
        editor = ace.edit("code");

        //设置风格和语言（更多风格和语言，请到github上相应目录查看）
        theme = "clouds"
        language = "javascript"
        editor.setTheme("ace/theme/" + theme);
        editor.session.setMode("ace/mode/" + language);

        //字体大小
        editor.setFontSize(18);

        //设置只读（true时只读，用于展示代码）
        editor.setReadOnly(false);

        //自动换行,设置为off关闭
        editor.setOption("wrap", "free")

        //启用提示菜单
        ace.require("ace/ext/language_tools");
        editor.setOptions({
            enableBasicAutocompletion: true,
            enableSnippets: true,
            enableLiveAutocompletion: true
        });
    </script>

</body>
</html>